.mgNavListDetails {
    width: 100%;
    background: #fafafa;
    .navListDetailsTop {
      position: fixed;
      top: 0;left: 0;
      width: 100%;
      z-index: 222;
      .am-tabs-default-bar-underline{
        border: 0!important;
      }
        .am-navbar-light{
            color: #818181;
            background: #fafafa;
        }
       .DetailsTopInp {
           background: #ececec;
           width: 7.28rem;
           height: 0.8rem;
           font-size: 0.426667rem;
           color: #393939;
           display: flex;
           justify-content: space-between;
           align-items: center;
           padding: 0 0.266667rem;
           .icon-fangdajing {
               color: #bebebe;
        }
      
        .DetailsTopSearch {
            border: 0;
            
            background: #ececec;
            width: 5.333333rem;
        }
      
        img {
            width: 0.666667rem;
            height: 0.666667rem;
      
      }
      
  
        }
      }

      .mgNavListDetailsTab{
          padding: 0 0.266667rem;
          .am-tabs-tab-bar-wrap{
            position: fixed;
            top: 1.2rem;
            left: 0;
            width: 100%;
            z-index: 111;
          }
          .am-tabs-content-wrap{
            margin-top: 2.4rem;
          }
          .am-tabs-default-bar-tab-active{
              color:  #ef4562;

          }
          #m-tabs-0-3{
              background: url(../../assets/images/index-bottom.png) no-repeat 1.733333rem center !important;
              background-size: 0.373333rem 0.213333rem!important;
          }
          #m-tabs-0-0,#m-tabs-0-1,#m-tabs-0-2{
            background: url(../../assets/images/index-Rightlist.png) no-repeat right center !important;
          }

          .NavListDetailsTabSynt {
              width: 100%;
              display: flex;
              justify-content: space-between;
              flex-wrap: wrap;
              .NavListDetailsTabJG{
                width: 100%;
                background:#ffffff;
                height: 2.666667rem;
                padding: 0 0.133333rem;
                color: #d9d9d9;
                .DetailsTabJGTop {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  height: 1.333333rem;
                  
                  .DetailsTabJGTopBtn {
                    width: 2.933333rem;
                    height: 0.8rem;
                    border: 0;
                    background: #f3f3f3;
                    color: #333333;
                    font-size: 0.373333rem;
                  }
                }
                
                .DetailsTabJGBtoom {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  height: 1.066667rem;

                  span {
                    font-size: 0.373333rem;
                    color: #333;
                  }
                  .DetailsTabJGBtoomInp {
                    width: 2.133333rem;
                    height: 0.8rem;
                    border: 0.026667rem solid #e8e8e8;
                    background: #fff;
                    text-align: center;
                  }
                
                  .TabJGBtoomInpBtn {
                    width: 2.133333rem;
                    height: 0.8rem;
                    background: #ff5b76;
                    border: 0;
                    color: #fff;
                    font-size: 0.373333rem;
                
                  }
                }
              }

            .DetailsTabSyntList {
                width: 4.586667rem;
                height: 8.266667rem;
                // flex: 1;
                margin-top: 0.266667rem;
                background: #fff;
                border-radius: 0.133333rem;
                overflow: hidden;
              .SyntListTop {
                  position: relative;
                  width: 4.693333rem;
                  height: 6.266667rem;
                .SyntListTopimg {
                    width: 4.693333rem;
                    height: 6.266667rem;
                }
                .SyntListTopimg2 {
                    position: absolute;
                    bottom: 0;right: 0;
                    width: 1.146667rem;
                    height: 1.146667rem;
          
                }
              }
          
              .SyntListTit {
                  overflow: hidden;
                  display: -webkit-box;
                  -webkit-line-clamp: 2;
                  -webkit-box-orient: vertical;
                  margin: 0.213333rem 0;
                  padding: 0 0.133333rem;
                  line-height: 0.533333rem;
                .SyntListTitStart {
                    background: #fafafa;
                    color: #c7c7c7;
                    padding: 0.053333rem;

          
                }
              }
          
              .SyntListBottom {
                display: flex;
                justify-content: space-between;
                padding: 0 0.133333rem;
                line-height: 0.373333rem;
                // margin-top: 0.533333rem;
                .SyntListBottomPic {
                  font-size: 0.426667rem;
                  font-weight: bold;
                  color: #333333;
          
                }
          
                .SyntListBottomvolume {
                  line-height: 0.373333rem;
                  font-size: 0.373333rem;
                  color: #a2a2a2;
                  padding-right: 0.4rem;
                  background: url(../../assets/images/insex-start.png) no-repeat right center;
                  background-size: 0.373333rem 0.373333rem;
          
                }
              }
            }
          }

         
      }
      .navListDetailsFlexd {
        .navListDetailsFlexdNav {
          z-index: 333;
          position: fixed;
          bottom: 0.266667rem;
          right: 0.133333rem;
          width: 1.333333rem;
          height: 1.333333rem;
          border-radius: 50%;
          background-color: rgba(77,77,77,0.9);
          color: #fff;
          display: flex;
          align-items: center;
          justify-content: center;
          transition: all 0.5s linear;
         }
         .navListDetailsFlexdTop{
          z-index: 332;
          position: fixed;
          bottom: 0.266667rem;
          right: 0.133333rem;
          width: 1.333333rem;
          height: 1.333333rem;
          border-radius: 50%;
          background-color: rgba(77,77,77,0.9);
          color: #fff;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-direction: column;
          align-items: center;
          opacity: 0;
          transition: all 0.5s linear;
       
         }
         .navListDetailsFlexdOP{
           transition: all 0.5s linear;
          opacity: 1;
         }
         .DetailsFlexdTop{
          transition: all 0.5s linear;
          bottom: 2rem;
         }
       }
    }